Vue.component('Child', {
  // props: ['titleContent'],
  props: {
    titleContent: Array,
    x: Number,
    y: Number,
    msg: String,
    age: Number
  },

  data() {
    return {
      message: this.msg
    }
  },

  computed: {
    newAge() {
      return this.age + 18
    }
  },

  template: `
    <div>
      <h1>{{titleContent}} {{x}} {{y}} {{message}}</h1>
      <div>{{newAge}}</div>
      <div><button @click="changeMsg">change msg</button></div>
    </div>
  `,

  methods: {
    changeMsg() {
      this.message = 'heihei'
    }
  },

  watch: {
    msg(newValue) {
      this.message = newValue
    }
  }
})